<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>管理员-添加广告</title>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <link rel="stylesheet" href="../css/mui.min.css">
    <link rel="stylesheet" type="text/css" href="../WebUploader/style.css">
    <link rel="stylesheet" href="../js/loding/loding.css">

    <!--引入JS-->
    <link rel="stylesheet" href="http://www.jq22.com/jquery/bootstrap-3.3.4.css">
    <link href="../summernote/dist/summernote.css" rel="stylesheet"/>
    <script src="../js/loding/loading.js"></script>
    <script src="../uploader/js/jquery.js"></script>
    <script src="../uploader/js/lrz.bundle.js"></script>
    <script src="../uploader/js/upload.js"></script>
    <!--引入JS-->


    <style>
        .mce-btn-group:not(:first-child) {
            border-left: 1px solid #d9d9d9;
            padding-left: 0px!important;
            margin-left: 0px!important;
        }
        li{
            list-style-type:none;
            width:150px;
        }
    </style>
</head>
<body>
<div class="mui-content" >
    <div class="headage"></div>
    <div class="container">
        <form class="mui-input-group">
            <div class="mui-input-row ">
                <label>标题:</label>
            </div>
            <div class="mui-input-row ">
                <input type="text" class=" mui-input-clear" placeholder="" id="title" style="width: 100%;font-size: 10px;">
            </div>
            <div class="mui-input-row ">
                <label>摘要:</label>
            </div>
            <div class="mui-input-row ">
                <input type="text" class=" mui-input-clear" placeholder="" id="pretext" style="width: 100%;font-size: 10px;">
            </div>
            <div class="mui-input-row ">
                <label>缩略图:</label>
            </div>
            <div class="mui-input-row " style="height: 160px;margin-left: 30%;">
                <div id="drop_area" ></div>
            </div>
            <div class="mui-input-row summernote" style="height: 460px;" id="summernote">

            </div>

            <div class="mui-input-row ">
                <button type="button" class="mui-btn mui-btn-primary" id="saveUpload"  style="width: 80%;height: 35px;float: left;margin-left: 10%;margin-top: 5px;">保存</button>
            </div>
        </form>




    </div>

</div>
</body>

<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script src="http://www.jq22.com/jquery/bootstrap-3.3.4.js"></script>
<script src="../summernote/dist/summernote.js"></script>
<script src="../summernote/dist/lang/summernote-zh-CN.js"></script>    <!-- 中文-->
<script src="../js/mui.min.js"></script>

<script src="../js/cookieutil.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/getUrlParam.js"></script>
<script src="../uploader/js/uploaderutils.js"></script>






<script type="application/javascript">
    $(".headage").load("head.html");
    var  preimage;
    var summer = $('#summernote');
    $(function(){

        /*公共部分
         * 导航栏
         * footer CopyRight
         */

        summer.summernote({
            height: 300,
            tabsize: 2,
            lang: 'zh-CN',
            callbacks: {
                onImageUpload: function (blobInfo,editor, welEditable) {
                    sendFile(blobInfo,editor, welEditable);
                }
            }
        });
        function sendFile(blobInfo,editor, welEditable) {
            var xhr, formData;
            xhr = new XMLHttpRequest();
            xhr.withCredentials = false;
            xhr.open("POST", "/Upload/multiUpload");
            formData = new FormData();
            formData.append("file", blobInfo[0]);
            xhr.onload = function(path){
                // var imgNode = document.createElement("img");
                // imgNode.src = this.responseText;
              var itrm= JSON.parse(this.responseText);
                summer.summernote('insertImage', imgsrcpath()+ itrm.object, 'image name');
            };
            xhr.send(formData);


        }
        imglist="";
        var dragImgUpload = new DragImgUpload("#drop_area",{
            callback:function (files) {
                //回调函数，可以传递给后台等等
                var file = files;
                console.log(file.name);
                saveimg(file,"缩略图");
            }
        })

        $("#saveUpload").click(function () {
            showLoading("正在跳转..","div");
            var title = $("#title").val();
            var pretext = $("#pretext").val();

            if (title == "" || title == undefined) {
                hideLoading();//隐藏后的回调函数
                mui.toast('请输入标题！');
                return;
            }
            if (pretext == "" || pretext == undefined) {
                hideLoading();//隐藏后的回调函数
                mui.toast('请输入摘要！');
                return;
            }

            var content= gethtmlcode();
            if (content == "" || content == undefined) {
                hideLoading();//隐藏后的回调函数
                mui.toast('请输入内容！');
                return;
            }
            console.log(preimage);
            mui.post('/Article/insert',
                {
                    title: title,
                    pretext: pretext,
                    preimage: imglist,
                    content: content
                },
                function (data) {
                    console.log(data);
                    if (data.code&&data.object>0) {
                        window.location.reload();
                        mui.toast('资料提交成功');
                    }
                    else {
                        mui.toast('资料提交失败！');
                    }
                }, 'json'
            )
            hideLoading();//隐藏后的回调函数
        });
        function gethtmlcode(){
            return  summer.summernote('code');
        }
    });
</script>

</html>